/*
 * @Author: hongbin
 * @Date: 2022-04-29 10:50:55
 * @LastEditors: hongbin
 * @LastEditTime: 2022-04-30 00:07:38
 * @Description:底部
 */
import { FC, ReactElement } from "react";
import styled from "styled-components";
import { flexCenter } from "../../styled";
import { FooterSvg } from "../Icon";
import SendMail from "./SendMail";
import GuohuiPng from "../../assets/guohui.png";

interface IProps {}

const Footer: FC<IProps> = (): ReactElement => {
  return (
    <Container>
      {FooterSvg}
      <SendMail />
      {FooterSvg}
      <Info
        onClick={() => {
          const queryUrl =
            "http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=21068202000040";
          window.open(queryUrl, "_blank");
        }}
      >
        <span>辽ICP备20005121号-1 21068202000040</span>
      </Info>
    </Container>
  );
};

export default Footer;

const Container = styled.footer`
  width: 100vw;
  height: 100vh;
  ${flexCenter};
  flex-direction: column;
  transform: translateY(20vmin);
  .footerPath {
    stroke: ${!window.IsMacSystem && "#7940b1"};
  }
`;

const Info = styled.div`
  ${flexCenter};
  background: ${`url(${GuohuiPng}) no-repeat`};
  padding-left: 26px;
  color: #cccccc;
  position: absolute;
  bottom: 1vmin;
  cursor: pointer;
  :hover {
    color: #ffffff;
  }
`;
